<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" type="text/css" href="../layui/css/layui.css" media="all"/>
    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
    <script src="../js/jquery.min.js"></script>

    <script>

        $(function () {

            $.ajax({
                url: '../activity/findAll',
                type: 'get',
                data: {
                    "page": 1,
                    "limit": 20
                },
                success: function (data) {
                    var n = data.data.length;
                    var labels = "";
                    // $(".layui-timeline > li").removeAttr("style");
                    console.log(data.data[0].ac_create_time);
                    for (var i = 0; i < n; i++) {
                        // var time = data.data[i].ac_create_time;
                        // $("#hahah").html(time);
                        var time = data.data[i].ac_create_time;
                        var introduction = data.data[i].ac_introduction;
                        labels += "<li class=\"layui-timeline-item\">";
                        labels += "<i class=\"layui-icon layui-timeline-axis\"></i>";
                        labels += "<div class=\"layui-timeline-content layui-text\">";
                        labels += "<h3 class=\"layui-timeline-title\" id=\"time\">" + time + "</h3>";
                        labels += "<p>" + introduction + "</p>";
                        labels += "</div>";
                        labels += "</li>";
                        $(".layui-timeline").html(labels);
                    }

                }
            });


        })

    </script>


</head>
<body>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
    <legend>活动时间线</legend>
</fieldset>
<ul class="layui-timeline">

</ul>

<!--<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">-->
<!--<legend>简约时间线：大事记</legend>-->
<!--</fieldset>-->
<!--<ul class="layui-timeline">-->
<!--<li class="layui-timeline-item">-->
<!--<i class="layui-icon layui-timeline-axis"></i>-->
<!--<div class="layui-timeline-content layui-text">-->
<!--<div class="layui-timeline-title">2018年，layui 5.0 发布。并发展成为中国最受欢迎的前端UI框架（期望）</div>-->
<!--</div>-->
<!--</li>-->
<!--<li class="layui-timeline-item">-->
<!--<i class="layui-icon layui-timeline-axis"></i>-->
<!--<div class="layui-timeline-content layui-text">-->
<!--<div class="layui-timeline-title">2017年，layui 里程碑版本 2.0 发布</div>-->
<!--</div>-->
<!--</li>-->
<!--<li class="layui-timeline-item">-->
<!--<i class="layui-icon layui-timeline-axis"></i>-->
<!--<div class="layui-timeline-content layui-text">-->
<!--<div class="layui-timeline-title">2016年，layui 首个版本发布</div>-->
<!--</div>-->
<!--</li>-->
<!--<li class="layui-timeline-item">-->
<!--<i class="layui-icon layui-timeline-axis"></i>-->
<!--<div class="layui-timeline-content layui-text">-->
<!--<div class="layui-timeline-title">2015年，layui 孵化</div>-->
<!--</div>-->
<!--</li>-->
<!--<li class="layui-timeline-item">-->
<!--<i class="layui-icon layui-anim layui-anim-rotate layui-anim-loop layui-timeline-axis"></i>-->
<!--<div class="layui-timeline-content layui-text">-->
<!--<div class="layui-timeline-title">更久前，轮子时代。维护几个独立组件：layer等</div>-->
<!--</div>-->
<!--</li>-->
<!--</ul>-->

<script type="text/javascript" src="../layui/layui.all.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script>
</script>


</body>
</html>